<template>
    <div>
        <h1>------------home的内容------------</h1>
        <h2>商品的数量:{{$store.state.count}}</h2>

        <ul>
            <li v-for="(item,index) in $store.state.goods" :key="index">{{item}}</li>
        </ul>
         <button @click="add">+</button>
         <button @click="sub">-</button>
         <button @click="addCound(10)">+10</button>
         <button @click="addGoods">添加商品</button>
        
        <button @click="updateProfile">修改个人信息</button>

        <button @click="aupdateProfile">a修改个人信息</button>
    </div>
</template>

<script>
export default {
    name:"Home",
    methods:{
        add(){
            this.$store.commit("increment");
        },
        sub(){
            this.$store.commit("decrement");
        },
        addCound(count){
            this.$store.commit({
                type:"addCountIncrement",
                count
            })
        },
        addGoods(){
            this.$store.commit({
                type:"addGood",
                newGood:{id:104,
                         name:"电饭煲", 
                         price:55.9, 
                         num:88}
            })
        },
        updateProfile(){
            //payload方法一
            // this.$store.commit("updateProfile",{
            //                     userId:"qwertyu",
            //                     pwd:"xb2126",
            //                     name : "西北",
            // })
            //payload方法二
            this.$store.commit({
                type:"updateProfile",
                newInfo:{
                    userId:"qwertyu",
                    pwd:"xb2126",
                    name : "西北",
                }
            })
        },
        aupdateProfile(){
            this.$store.dispatch({
                type: "aupdateProfile",
                newInfo:{
                    userId:"qwertyu",
                    pwd:"xb2126",
                    name : "西北",
                },
                succeed: () => {
                    console.log("数据更新成功");
                    console.log(this.$store.state.profile);
                }
            })
        }
    }
}
</script>

<style scoped>

</style>